<template>
	<view class="content">
		<scroll-view>
			<view style="padding: 20px 20px;">
				<view style="display: flex;flex-direction: row;width: 150px;align-items: center;margin: 0 auto; ">
					<image class="logo" src="/static/logo.png"></image>
					<image class="logo" src="/static/douyin.png"></image>
				</view>
				<view class="text-area">
					<text class="title">{{title}}</text>
				</view>
				<view><textarea v-model="jsonData"
						style="border:1px solid  #F1F1F1;width: 96%;margin-left: 2%;margin-top: 5px;height: 100px;"
						placeholder="请求响应数据"></textarea> </view>

				<view class="tip">基础功能</view>

				<view class="tworow" style="display: flex;flex-direction: row;flex-wrap: wrap;">
					<button @click="checkinstall">是否已安装抖音</button>
					<button @click="checkPerm">检查相册权限</button>
					<button @click="openAppSet">打开App设置</button>
					<button @click="oauth">抖音授权登录</button>
					<button @click="startlanche">启动拍摄页</button>
					<button @click="sdkversion">SDK版本</button>
				</view>

				<view class="tip">分享内容给用户</view>
				<view style="display: flex;flex-direction: row;">
					<button @click="share2user('image')">分享图片</button>
					<button @click="share2user('video')">分享视频</button>
					<button @click="share2user('link')">分享链接</button>
				</view>

				<view class="tip">分享到抖音</view>
				<view style="display: flex;flex-direction: row;">
					<button @click="sharevidoe('image')">分享图片</button>
					<button @click="sharevidoe('video')">分享视频</button>
					<button @click="downloadmedia">下载并刷新相册</button>
				</view>

				<view class="tip">相册操作</view>
				<view style="display: flex;flex-direction: row;">
					<button @click="pickfromsys('image')">选取图片</button>
					<button @click="pickfromsys('video')">选取视频</button>
				</view>
				<view class="tip">通过系统相册资源ID进行分享</view>
				<view style="display: flex;flex-direction: row;">
					<view>先选择相册/图片，在点本按钮</view>
					<button @click="shareViaIds()">通过系统ID分享</button>
				</view>
				<view class="tip">通过临时地址分享</view>
				<view style="display: flex;flex-direction: row;">
					<button @click="shareByTemp()">通过临时地址分享， 下载进度{{progrss}}%</button>
				</view>

				<view class="tip">通过uni选择地址分享</view>
				<input type="text" v-model="unimergemp4url" placeholder="视频或者图片URL地址"
					style="border: 1px solid red;height: 35px;margin-bottom: 10px;" />
				<view style="display: flex;flex-direction: row;">
					<button @click="shareByUniVideo('video')">选择视频并分享</button>
					<button @click="shareByUniVideo('image')">选择图片并分享</button>
				</view>

				<view class="tip">分享到抖音</view>
				<view style="display: flex;flex-direction: column;">
					<view>
						<textarea style="height: 80px;width: 100%; border: 1px solid #3F536E;" v-model="vidoeurl"
							placeholder="输入视频地址,如果通过url得不到视频文件类型,需要下载的保存的文件名" />
					</view>
					<view style="display: flex;flex-direction: row;">
						<button @click="publishUrl" style="margin-top: 5px;">通过URL发布</button>
						<select v-model="pubtarget">
							<option value="edit" selected="true">编辑页面</option>
							<option value="publish">发布页面</option>
							<option value="clip">剪辑页面</option>
						</select>
					</view>
				</view>
				<view class="tip">图片封面管理</view>
				<view style="display: flex;flex-direction: column;">
					<input style="width: 100%;" placeholder="内容输入" v-model="coverinput" />
					<view style="display: flex;flex-direction: row;">
						<button @click="getCover" style="margin-top: 5px;">获取资源封面</button>
						<button @click="getMediaInfoAndPath" style="margin-top: 5px;">选取视频并返回详情</button>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	var plugin = uni.requireNativePlugin('Vnidev-DyPlugin-Core')
	const dyclientId = 'awl52rl664pxcflk';

	export default {
		data() {
			return {
				title: 'Uni 抖音SDK',
				authdata: null,
				vidoeurl: 'http://192.168.10.110:8912/640.jpg,http://192.168.10.110:8912/aab.mp4',
				resoucesids: '',
				pubtarget: 'publish', // "edit" //clip,publish
				coverinput: '',
				progrss: 0,
				_pickfromsys: 'image',
				unimergemp4url: 'http://192.168.10.110:10000/1.mp4'
			}
		},
		onLoad() {

		},
		computed: {
			jsonData() {
				if (this.authdata) {
					return JSON.stringify(this.authdata, null, 4);
				}
				return "";
			}
		},
		methods: {
			shareByUniVideo(type) {
				var lfs = null
				let self = this
				if (!self.unimergemp4url) {
					uni.showToast({
						title: "地址不能为空"
					})
					return;
				}
				uni.downloadFile({
					url: self.unimergemp4url,
					success: (res) => {
						if (res.statusCode === 200) {
							console.log('下载成功');
						}
						let tempurl = plus.io.convertLocalFileSystemURL(res.tempFilePath)
						plus.gallery.pick((e) => {
							var files = []
							for (var i in e.files) {
								files.push(plus.io.convertLocalFileSystemURL(e.files[i])) 
							}
							files.push(tempurl);
							var config = {
								appid: dyclientId,
								sharetype: 'video',
								mediaPaths: files,
								mpInfo: null,
								hashtag: 'hashtag',
								state: 'state',
								startpage: 'clip'
							}
							plugin.shareMediaViaUniDownloadPaths(config, (res) => {
								this.authdata = res
								var fileids = res.fileids;
								console.info("files ids: ",fileids)
								//删除临时文件，会有提示框
								plugin.deleteMediaByFileIds({
									fileids: fileids
								},(res)=>{
									console.info('删除',res)
								})
								
							})
							
						}, function(e) {
							console.log("取消选择图片");
						}, {
							filter: type,
							multiple: true,
							selected: lfs,
							maximum: 9,
							system: false
						});
					}
				})

				
			},
			startShare(file1,file2){
				
			},
			getCover() {
				plugin.getCover({
					path: this.coverinput
				}, data => {
					this.authdata = data
				});
			},
			getMediaInfoAndPath() {
				plugin.getMediaInfoAndPath({}, data => {
					this.authdata = data
				});
			},
			shareByTemp() {
				var that = this
				console.log(`准备下载：${that.vidoeurl}`);
				var downloadTask = uni.downloadFile({
					url: this.vidoeurl,
					complete: (res) => {
						console.log(res.tempFilePath)
						let fileSaveUrl = plus.io.convertLocalFileSystemURL(res.tempFilePath);
						//console.log('fileSaveUrl', fileSaveUrl)
						var config = {
							appid: dyclientId,
							sharetype: 'image',
							mediaPaths: [fileSaveUrl],
							mpInfo: null,
							hashtag: 'hashtag',
							state: 'state',
							startpage: 'clip'
						}
						plugin.shareMediaViaUniDownloadPaths(config, (res) => {
							this.authdata = res
						})
					}
				});
				downloadTask.onProgressUpdate((res) => {
					console.log(res.progress)
					that.progrss = res.progress
				})
			},
			checkinstall() {
				var p = {
					"appid": dyclientId,
				}
				plugin.hasDouyin(p, data => {
					this.authdata = data
				});
			},
			checkPerm() {
				plugin.hasPhotoPerm({}, data => {
					this.authdata = data
				});
			},
			openAppSet() {
				plugin.openAppSetting();
			},
			publishUrl() {
				uni.showLoading({
					title: "正在处理.."
				})
				//通过url地址分享
				plugin.shareVideoUrl({
					"appid": dyclientId,
					"debug": true,
					"filename": "1648454685371qyjvideo.mp4",
					"startpage": this.pubtarget,
					"url": this.vidoeurl,
					"mpInfo": {
						"title": "京东好物·生鲜水果",
						"description": "弄懂",
						"appUrl": "pages/product/product?wareId=19579574388",
						"appid": "tta9e7df5a36cd128c"
					}
				}, res => {
					this.authdata = res
					uni.hideLoading()
				});
			},
			downloadmedia() {
				uni.showLoading({
					title: "正在处理.."
				})
				plugin.downloadMedia({
					urls: [
						"http://192.168.10.110:9090/videoplayback.mp4",
						"http://192.168.10.110:9090/a.mp4",
						"http://192.168.10.110:9090/b.mp4",
						"http://192.168.10.110:9090/c.mp4"
					],
				}, res => {
					this.authdata = res
					uni.hideLoading()
				});
			},
			downAsUnidown() {
				uni.downloadFile({
					url: ''
				})
			},
			oauth() {
				var ext = {
					"appid": dyclientId,
					"mobile": 'checked',
					"video.list": "checked",
					"data.external.user": "checked"
				}
				plugin.ssoLogin(ext, (res) => {
					this.authdata = res
				})
			},
			sdkversion() {
				plugin.sdkVersion({}, res => {
					this.authdata = res
				})
			},
			sharevidoe(type) {
				var ext = {
					"appid": dyclientId,
					"type": type,
					"maxshare": 5,
					"hashtag": "hashtag,hastag2",
					"state": "state",
					"startpage": "edit" //clip,publish
				}
				plugin.shareMedia(ext, (res) => {
					this.authdata = res
				})
			},
			pickfromsys(type) {
				this._pickfromsys = type
				var config = {
					type: type, // video | image
					max: 5
				}
				plugin.pickMedia(config, (res) => {
					this.authdata = res
				})
			},
			shareViaIds(paths) {
				var data = this.authdata.selected;
				console.log("share:", data)
				console.log("share from :", this._pickfromsys)
				var config = {
					appid: dyclientId,
					sharetype: this._pickfromsys,
					mediaIds: data,
					mpInfo: null,
					hashtag: 'hashtag',
					state: 'state',
					startpage: 'clip'
				}
				plugin.shareMediaViaPaths(config, (res) => {
					this.authdata = res
				})
			},
			share2user(type) {
				var iamge = {
					"appid": dyclientId,
					"type": "image", //video,link
					"maxshare": 1,
					"hashtag": "hashtag",
					"state": "state",
					"mediaName": "1648454685371qyjvideo.mp4",
					"mediaUrl": "http://192.168.10.110:9000/567082ac3ae39699f68de4fd2b7444b1e045515a.mp4"
				}
				var video = {
					"appid": dyclientId,
					"type": "video",
					"maxshare": 1,
					"hashtag": "hashtag",
					"state": "state"
				}

				var link = {
					"appid": dyclientId,
					"type": "link",
					"hashtag": "hashtag",
					"state": "state",
					"link": {
						"url": "http://www.baidu.com",
						"title": "百度首页",
						"desc": "中国百度",
						"cover": "https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png"
					}
				}

				plugin.shareToUser(
					type == 'image' ? iamge : ((type == 'video') ? video : link), (res) => {
						this.authdata = res
					})
			},
			startlanche() {
				plugin.startCreate({
					"appid": dyclientId,
					"state": "a47e57c6c559acb88a9569da66ee5f65e0f779c9",
					"hashtag": "hashtag,hashtag2",
					"mpInfo": {
						"title": "京东好物·生鲜水果",
						"description": "弄懂",
						"appUrl": "pages/product/product?wareId=19579574388",
						"appid": "tta9e7df5a36cd128c"
					}
				}, (res) => {
					this.authdata = res
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 100rpx;
		width: 100rpx;
		margin-top: 20rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	.tip {
		font-size: 13px;
		border-bottom: 2px solid red;
		padding-top: 20px;
		padding-bottom: 5px;
		margin-bottom: 10px;
		color: red;
	}

	button {
		font-size: 13px;
	}

	.tworow button {
		margin-bottom: 5px;
	}
</style>
